﻿<template>
  <div class="table">
    <!--表2季度生产情况T_MulQuartProduc-->
    <Row>
      <div class="divSearch">
        <Row>
          <Col span="24" class="col-margin"> 填报年度：
          <Select v-model="searchModel.FillInYear" placeholder="全部" style="width: 100px" @on-change="getReportData()">
            <Option value="">全部</Option>
            <Option :value="item.DictText" v-for="item in CreateYearList" :key="item.DictValue">{{item.DictText}}</Option>
          </Select>
          <Button icon="ios-search" type="ghost" @click="getReportData()" class="ButtonStyle">
            查询
          </Button>
          <Button icon="ios-download" type="primary" @click="ExcelDown()" class="searchButton" style="float:right;width: 100px;">数据导出</Button>
          <Upload :on-success="handleSuccess" :action="GetPostUrl()" style="float:right;width: 100px;" v-show="ReportStatus <3">
            <Button type="primary" icon="ios-cloud-upload-outline" class="searchButton">数据导入</Button>
          </Upload>
          <Button icon="ios-cloud-download" type="primary" @click="TmpDown()" class="searchButton" style="width: 100px;">模板下载</Button>
          <!-- <label style="float:right;padding: 6px;font-size:16px;">当前状态:
          <span v-if="ReportStatus==0" class="Error"></span> 
          <span v-else-if="ReportStatus==1" class="NoReport">未填写</span>
          <span v-else-if="ReportStatus==2" class="AlreadyReport">已填写</span>
          <span v-else-if="ReportStatus==3" class="UpReport">已上报</span>
          <span v-else-if="ReportStatus==4" class="Success">审核通过</span>               
      </label> -->
          </Col>
        </Row>
      </div>
    </Row>
    <!-- <Row style="padding-left: 10px;">
      <Col>
      <Button icon="plus" type="ghost" size="small" @click="addItem" :disabled="ReportStatus < 3 && BtnSaveStatus ? false:true">新增</Button>
      </Col>
    </Row> -->
    <Row>
      <table class="ContentTable">
          <caption>
            <label style="float:left">{{searchModel.FillInYear}}表4全年饲养蚕品种构成调查表</label>
            <label style="float:right">当前状态:
              <!-- <span v-if="ReportStatus==0" class="Error">重新填写</span>  -->
              <Poptip trigger="hover" placement="left-start" v-model="visible" :content="ReportOpinion" v-if="ReportStatus==0">
                      <span  class="Error">重新填写</span> 
                    </Poptip>
              <span v-else-if="ReportStatus==1" class="NoReport">未填写</span>
              <span v-else-if="ReportStatus==2" class="AlreadyReport">已填写</span>
              <span v-else-if="ReportStatus==3" class="UpReport">已上报</span>
              <span v-else-if="ReportStatus==4" class="Success">审核通过</span>    
              <span v-else class="NoReport">无需填报</span>                                 
            </label><br/>
             <label style="float:left;margin:5px">
               <Button icon="plus" type="ghost" size="small" @click="addItem" :disabled="ReportStatus < 3 && BtnSaveStatus ? false:true">新增</Button>
            </label> 
        </caption>
        <thead>
        <tr>
          <th rowspan="2">品种</th>
          <th colspan="5">发种量(张)</th>
          <th rowspan="2">备注</th>
          <th rowspan="2" width="50px">操作</th>
        </tr>
        <tr>
          <th>合计</th>
          <th>春</th>
          <th>夏</th>
          <th>正秋</th>
          <th>晚秋</th>
        </tr>
        </thead>
        <tbody style="max-height:260px;">
        <tr v-for="dataitem in datalist" :key="dataitem.Id">
          <td>
            <Input style="display:none;" v-model="dataitem.Id"></Input>
            <Input style="display:none;" v-model="dataitem.ReportId"></Input>
            <Select v-model="dataitem.CultivarName" placeholder="请选择品种">
                <Option :value="item.DictValue" v-for="item in CultivarList" :key="item.DictValue">{{item.DictText}}</Option>
            </Select>
          </td>
          <!-- 合计 -->
          <td>
            {{(Number(dataitem.SeedSizeSpring)+Number(dataitem.SeedSizeSummer)+Number(dataitem.SeedSizeZQ)+Number(dataitem.SeedSizeWQ))|integer}}
          </td>
          <td>
            <Input v-model="dataitem.SeedSizeSpring"></Input>
          </td>
          <td>
            <Input v-model="dataitem.SeedSizeSummer"></Input>
          </td>
          <!-- 正秋 -->
          <!-- <td style="text-align:right;width:5%;">
            <Input v-model="dataitem.SeedSizeAutumn"></Input>
          </td> -->
          <td>
            <Input v-model="dataitem.SeedSizeZQ"></Input>
          </td>
          <!-- 晚秋 -->
          <td>
            <Input v-model="dataitem.SeedSizeWQ"></Input>
          </td>
          <td>
            <Input v-model="dataitem.Remark" placeholder="备注长度请小于150个字符..."></Input>
          </td>
          <td width="50px">
            <Button type="ghost" size="small" icon="ios-trash-outline" style="color:#FF0000" @click="delOp(dataitem)" :disabled="ReportStatus < 3 && BtnSaveStatus ? false:true"></Button>
          </td>
        </tr>
        </tbody>
      </table>
      <div class="divButton">
        <Button type="primary" @click="save()" :disabled="ReportStatus < 3 && BtnSaveStatus ? false:true">保存</Button>
        <Button type="primary" @click="DataUp()" :disabled="ReportStatus == 2 ? false:true">上报</Button>
      </div>
      <Alert banner type="error">
        <p style="color:red;">填报说明:</p>
        <!-- <p>品种：菁松×皓月（正反交）、云蚕7×云蚕8（正反交）、秋丰×白玉、两广二号（正反交）、781、7532、932×芙蓉、7532×湘晖、雄蚕、华康系列。</p> -->
        <p>若有表格中未列入品种，请联系云南省农业技术推广总站蚕桑科管理人员。</p>
        <p style="color:red;font-size: 16px;padding-top: 10px;">特别注意：若指标项没有数据，请直接填“0”</p>
        <span slot="desc"></span>
      </Alert>
    </Row>
  </div>
  </template>
  <script>
    export default {
      data() {
        return {
          ReportOpinion:'',
          visible:true,
          datalist: [],
          datas: {}, //table数据对象
          CultivarList: this.GetGroupDict("CSCultivar"),
          CreateYearList: this.GetGroupDict("ReportYear"), //上报年份
          CurrentYear: this.GetCurrentYear(), //当前年度
          ReportId: '',
          ReportStatus: '',
          index:0,
          BtnSaveStatus: false, //保存按钮开关
          //查询模型：根据需求删除不不要查询条件
          searchModel: {
            ReportCode: 'MulAnnualRear',
            FillInYear: '',
            AreaCode: this.GetlocaStorage("CSuserinfo").AreaCode
          },
          clientHeight: window.innerHeight - 260, //表格默认高度
        }
      },
      mounted() {
        //table高度计算方法
        const that = this;
        window.onresize = () => {
          return (() => {
            that.clientHeight = window.innerHeight - 260;
          })()
        };
      },
      methods: {
        addItem() {
          var model = { //编辑模型
            Id: 0,
            ReportId: '',
            CultivarName: '',
            SeedSizeSpring: '',
            SeedSizeSummer: '',
            SeedSizeAutumn: '',
            Remark: '',
            SeedSizeZQ:'',
            SeedSizeWQ:'',
          };
          model.ReportId = this.ReportId;
          model.Id = this.datalist.length + 1;
          this.datalist.push(model);
        },
        delOp(m) {
          for (var i = 0; i < this.datalist.length; i++) {
            if (this.datalist[i].Id == m.Id) {
              this.datalist.splice(i, 1);
            }
          }
        },
        //数据上报
        DataUp() {
          var self = this;
          self.$Modal.confirm({
            title: '提示信息',
            content: '<p>数据上报后，不能再更改，是否继续上报？</p>',
            onOk: () => {
              var model = new Object();
              model.Id = self.ReportId;
              model.reportType = '3';
              model.strMsg = '';
              this.$http.post("Report/PostUpStatus", model).then(
                function (res) {
                  if (res.data.status == 1) {
                    self.$Notice.success({
                      title: '数据上报成功！',
                      desc: false
                    });
                    self.getReportData();
                  } else {
                    self.$Modal.error({
                      title: "提示信息",
                      content: "数据上报失败!"
                    });
                  }
                }
              );
            }
          });
        },
        getReportData() {
          var self = this;
          var user = this.GetlocaStorage("CSuserinfo");
          this.searchModel.AreaCode = user.AreaCode;
          if (self.searchModel.FillInYear != null && self.searchModel.FillInYear != '') {
            this.searchModel.FillInYear = self.searchModel.FillInYear;
          } else {
            this.searchModel.FillInYear = self.CurrentYear + '年'; //填报年度-----数据字典值
          }
          self.$http.post('Report/PostPageList', this.searchModel).then(function (res) {
            if (res.data.status === 1) {
              if (res.data.rows.length > 0) {
                self.ReportId = res.data.rows[0].Id;
                self.ReportStatus = res.data.rows[0].Status;
                self.BtnSaveStatus = true;
              } else {
                self.ReportId = '';
                self.ReportStatus = '';
                self.BtnSaveStatus = false;
              }
              self.getPageData(self.ReportId);
            } else {
              self.$Modal.error({
                title: '提示信息',
                content: res.data.message
              });
            }
          });
        },
        //获取this.datas: {},//table数据对象
        getPageData(ReportId) {
          var self = this;
          var reportCode = self.searchModel.ReportCode;
          this.$http.get("Report", {
            params: {
              id: ReportId,
              reportCode: reportCode
            }
          }).then( //获取数据编辑项的值
            function (res) {
              switch (res.data.list.status) {
                case 1:
                  self.ReportOpinion=res.data.Opinion;
                  self.datalist = res.data.list.model;
                  break;
                case 0:
                  self.$Modal.error({
                    title: "提示信息",
                    content: "数据加载失败!!!"
                  });
                  break;
                case -1:
                  self.$Modal.error({
                    title: "提示信息",
                    content: "数据加载失败!!!"
                  });
                  break;
              }
            }
          );
        },
        checkEmpty(value){
          var reg = /\S/;
          var temp = /^[0-9]\d*(\.\d+)?$/;//数字验证
          var p=/^[0-9]+([.]{1}[0-9]{0})?$/;//匹配整数或带一个小数
          if(value != null && value!=""||value=="0"||value==0){
            if (reg.test(value)) {
              if (temp.test(value) == false) 
              {
                return false;
              }
              else {
                if(p.test(value)==false)
                {
                  return false;
                }
                else{
                  return true;
                }
              }
            } 
            else {
              return false;
            }
          }else{
              return false;
          }
        },
        //保存方法
        save() {
          var self = this;
          var m=0;
          for(var i=0;i<self.datalist.length;i++)
          {
            if(self.checkEmpty(self.datalist[i].SeedSizeSpring)&&self.checkEmpty(self.datalist[i].CultivarName)
              &&self.checkEmpty(self.datalist[i].SeedSizeSummer)&&self.checkEmpty(self.datalist[i].SeedSizeZQ)
              &&self.checkEmpty(self.datalist[i].SeedSizeWQ)){
              m+=1;
            }
          }
          if(m==self.datalist.length){
            this.$http.post('MulAnnualRear', self.datalist).then(
            function (res) {
              if (res.data.status == 1) {
                self.getReportData(); //读取分页数据
                //self.datalist = [];
                self.$Notice.success({
                  title: '保存成功！',
                  desc: false
                });
              } else {
                self.$Modal.warning({
                  title: "提示信息",
                  content: "更新失败,请与管理员联系!"
                });
              }
            });
          }else{
            this.$Notice.error({
              title: '数据有误,请检查后再试!',
              desc: '',
            });
          }
        },
        //导入
        GetPostUrl() {
          var url = this.$http.defaults.baseURL + "Report/PostImportData?FillInYear="+this.searchModel.FillInYear+"&&ReportCode=" + this.searchModel.ReportCode +
            "&&AreaCode=" + this.searchModel.AreaCode;
          return url;
        },
        handleSuccess(res, file) {
          var self = this;
          self.getReportData();
          self.$Notice.success({
            title: '数据导入成功！',
            desc: false
          });
        },
        //导出
        ExcelDown: function () {
          var self = this;
          var model = new Object();
          model.ReportCode = self.searchModel.ReportCode;
          if (self.searchModel.FillInYear != null && self.searchModel.FillInYear != '') {
            model.FillInYear = self.searchModel.FillInYear;
          } else {
            model.FillInYear = self.CurrentYear + '年'; //填报年度-----数据字典值
            self.searchModel.FillInYear = self.CurrentYear + '年';
          }
          model.AreaCode = self.searchModel.AreaCode;
          window.open(this.$http.defaults.baseURL + "MulAnnualRear/GetExcelData?ReportCode=" + model.ReportCode +
            "&&FillInYear=" + model.FillInYear + "&&AreaCode=" + model.AreaCode);
        },
        //模板下载
        TmpDown: function () {
          window.open(this.$http.defaults.baseURL + "Report/GetTemplateData?ReportCode=" + this.searchModel.ReportCode);
        },
      },
      //创建Vue页面方法
      created: function () {
        //创业Vue前调用获取this.datas: {},//table数据对象
        this.getReportData();
      },
      watch: {
        //需要监听的在此处新增监听对象
      }
    }
  </script>
  <style scoped src="../../../styles/stats.css"></style>
